<template>
    <div id="app" class="app .ignore">
        <router-view v-if="isRouterAlive" />
        <van-tabbar v-if="showTabbar" v-model="tabbarActive" active-color="#3365e3" inactive-color="gray"
            class="tabber-fixed">
            <van-tabbar-item replace :to="value.path" v-for="(value, index) in tabbarListArr" :key="index">
                <span>{{ value.title }}</span>
                <template #icon="props">
                    <i class="iconfont" :class="value.icon"></i>
                </template>
            </van-tabbar-item>
        </van-tabbar>
    </div>
</template>

<script>

export default {
    name: "Home",

    provide() {
        return {
            reLoad: this.reLoad
        };
    },

    data() {
        return {
            isRouterAlive: true,

            showTabbar: false,
            tabbarActive: 0,
            tabbarListArr: []
        };
    },
    watch: {
        $route(to) {
            this.fnActiveIndex(to.name);
        },
    },
    methods: {

        /*刷新方法*/
        reLoad() {
            this.isRouterAlive = false;
            this.$nextTick(() => {
                this.isRouterAlive = true;
            });
        },

        /*tabbar 切换 active + 是否显示*/
        fnActiveIndex(pathName) {
            this.showTabbar = false;
            this.tabbarListArr.forEach((item, index) => {
                if (item.name == pathName) {
                    this.tabbarActive = index;
                    this.showTabbar = true;
                }
            })
        },

    },
    created() {
        this.tabbarListArr = [
            {
                path: "/index",
                name: "index",
                title: this.$t('Zhuye'),
                icon: "icon-warehouse-delivery",
            },
            {
                path: "/market",
                name: "market",
                title: this.$t('Shichang'),
                icon: "icon-bingzhuangtucopy",
            },
            {
                path: "/trade",
                name: "trade",
                title: this.$t('Jiaoyi'),
                icon: "icon-jiaoyishuju",
            },
            {
                path: "/manageFinances",
                name: "manageFinances",
                title: this.$t('Zichan'),
                icon: "icon-qutouzi",
            },
            {
                path: "/my",
                name: "my",
                title: this.$t('My'),
                icon: "icon-shezhi1",
            },
        ]
        //这里是记录当前点击导航的位置 下次刷新当前页面时 会记录当前位置
        const pathName = this.$route.name;
        // console.log(pathName);
        this.fnActiveIndex(pathName);

        this.GLOBAL.getSession();
    },
};
</script>
